<!--
 * @Description: 关联文档
-->
<script>
    //引入回显关联文档对象操作
    import {createAttachment, replaceArea} from '@/helper/relation-doc';
    import globalData from '@/plugins/data';
    import globalMethods from '@/plugins/methods';
    import {mapState} from "pinia";
    import {useBaseInfoStore} from "@/store/modules/base-info";
    import {fireEvent, getCollEventParams} from "@/handles/common/sdk";

    export default {
        props: {
            //关联文档区域。用于弹窗回显。默认'doc1'，
            //因为以前的代码，基础信息那里的关联文档就是这个名称
            area: {
                type: String,
                default: 'doc1',
            },
            isNewMode: { // 是否为新组件模式
                type: Boolean,
                default: false,
            },
        },
        data() {
            return {
                relationDocName: this.$i18n('common.toolbar.insert.mydocument.label'),
                flag: false,
            };
        },
        computed:{
            ...mapState(useBaseInfoStore, ['secretLevelAble','businessData']),
        },
        methods: {
            /**
             * @description: 关联文档弹窗
             */
            async openDialog() {

                let hook = await fireEvent('relationDoc', getCollEventParams(this.businessData, globalData));
                if (!hook) {
                  return;
                }
                // 先生成iframe的src
                const url = `/seeyon/ctp/common/associateddoc/assdocFrame.do?isBind=1,3&referenceId=${globalData.summaryId}&applicationCategory=1&Zxchat=1&poi=${this.area}&isNewStyle=true&showRelateDocSecret=${this.secretLevelAble}`;
                const area = this.area;
                const dialog = globalMethods.dialog({
                    title: $.i18n('common.toolbar.insert.mydocument.label'),
                    width: 1000,
                    height:  window.top.innerHeight * 0.8,
                    centered: true,
                    bodyStyle: 'padding: 0',
                    dialogStyle: { 'padding-bottom': 0 },
                    url,
                    transParams: {
                      parentWin: window,
                      fileUploadAttachments:this.fileList,
                      
                    },
                    afterClose: () => {
                        this.flag = false;
                    },
                    onCancel: () => {
                        dialog.close();
                    },
                    onConfirm: () => {
                        if (this.flag) return;
                        this.flag = true;

                        //获取iframe上下文
                        const ctx = dialog.dialog().contentWindow;

                        //获取选择的附件列表
                        let docList = ctx.fileUploadAttachments.values().toArray();

                        //如果没选择文件就弹窗提示
                        if (!docList.length) {
                            this.flag = false;
                            return this.$message.error($.i18n('assdoc.choose.atleastone.mesg'));
                        }
                        //替换成新附件对象
                        docList = createAttachment(docList, this.area)
                        docList.forEach((element) => {
                            element.showArea = area;
                            element.subReference="";
                        });
                        //通知设置列表数据
                        this.$emit('selected', docList);

                        //保存本window的fileUploadAttachments上
                        //再次打开弹窗回显的时候要填充进去
                        replaceArea(this.area, docList);

                        dialog.close();
                    },
                });
            },
        },
        render() {
            return (
                <div id="relation-doc" onClick={this.openDialog} class={this.isNewMode ? 'color-primary' : ''}>
                    { !this.isNewMode && <i class="syIcon sy-associated_document color-primary" /> }{this.relationDocName}
                </div>
            );
        },
    };
</script>
<style lang="scss" scoped>
    #relation-doc {
        line-height: 24px;
        color: #333;
        cursor: pointer;

        &:hover {
            color: $primary-color;
        }

        > .sy-associated_document {
            margin-right: 4px;
        }
    }
</style>
